import React, { Component } from 'react'

export default class Hello extends Component {
  state = {
    lists: []
  }

  getHotLists = () => {
    fetch('url')
      .then(res => res.json())
      .then(data => {
        const { data: { content } } = data
        this.setState({
          lists: content
        })
      }).catch(error => Promise.reject(error))
  }

  rebderLists = () => {
    //加判断
    if (this.state.lists.length == 0) return <div>加载中....</div>

    return this.state.lists.map(item => <li key={item.id}>
      <img src={item.pic} />
      <h3> {item.d_title} </h3>
    </li>)
  }

  render () {
    return (
      <div>
        <button onClick={this.getHotLists}>人气</button>
        <button>最新</button>
        <button>销量</button>
        <button>价格</button>

        <ul>
          {this.rebderLists()}
        </ul>
      </div>
    )
  }
}
